<!doctype html>
        <!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7" lang="en-US"> <![endif]-->
        <!--[if IE 7]>    <html class="lt-ie9 lt-ie8" lang="en-US"> <![endif]-->
        <!--[if IE 8]>    <html class="lt-ie9" lang="en-US"> <![endif]-->
        <!--[if gt IE 8]><!--> <html lang="en-US"> <!--<![endif]-->
        <head>
                <!-- META TAGS -->
                <meta charset="UTF-8" />
                <meta name="viewport" content="width=device-width, initial-scale=1.0">

                <title>Knowledge Base Theme</title>

                <link rel="shortcut icon" href="../../images/favicon.png" />


                

                <!-- Style Sheet-->
                <link rel="stylesheet" href="style.css"/>
                <link rel='stylesheet' id='bootstrap-css-css'  href='../../css/bootstrap5152.css?ver=1.0' type='text/css' media='all' />
                <link rel='stylesheet' id='responsive-css-css'  href='../../css/responsive5152.css?ver=1.0' type='text/css' media='all' />
                <link rel='stylesheet' id='pretty-photo-css-css'  href='../../js/prettyphoto/prettyPhotoaeb9.css?ver=3.1.4' type='text/css' media='all' />
                <link rel='stylesheet' id='main-css-css'  href='../../css/main5152.css?ver=1.0' type='text/css' media='all' />
                <link rel='stylesheet' id='custom-css-css'  href='../../css/custom5152.html?ver=1.0' type='text/css' media='all' />

                <script src="https://cdn.jsdelivr.net/npm/vue"></script>
                <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

                <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
                <!--[if lt IE 9]>
                <script src="../../js/html5.js"></script></script>
                <![endif]-->

        </head>

        <body>
        <!--vue管理开始-->
           <div id="problemAnswerPage">
                <!-- Start of Header -->
                <div id="test" class="header-wrapper">
                        <header>
                                <div class="container">


                                        <div class="logo-container">
                                                <!-- Website Logo -->
                                                <a href="index-2.html"  title="Knowledge Base Theme">
                                                        <img src="images/logo.png" alt="Knowledge Base Theme">
                                                </a>
                                                <span class="tag-line">Java面试、学习必备网站</span>
                                        </div>


                                        <!-- Start of Main Navigation -->
                                        <nav class="main-nav">
                                                <div class="menu-top-menu-container">
                                                        <ul id="menu-top-menu" class="clearfix">
                                                                <li class="current-menu-item"><a href="/">Home</a></li>
                                                                <li><a href="all-categories-problem.html">所有问题</a></li>
                                                        </ul>
                                                </div>
                                        </nav>
                                        <!-- End of Main Navigation -->

                                </div>
                        </header>
                </div>
                <!-- End of Header -->

                <!-- Start of Page Container -->
                <div class="page-container">
                        <div class="container">
                                <div class="row">

                                        <!-- start of page content -->
                                        <div class="span8 page-content">

                                                <ul class="breadcrumb">
                                                        <li><a href="#">Knowledge Base Theme</a><span class="divider">/</span></li>
                                                        <li><a href="#" title="View all posts in Server &amp; Database">Server &amp; Database</a> <span class="divider">/</span></li>
                                                        <li class="active">Integrating WordPress with Your Website</li>
                                                </ul>

                                                <article class=" type-post format-standard hentry clearfix">

                                                        <h1 class="post-title"><a href="#">{{problem.title}}</a></h1>

                                                        <div class="post-meta clearfix">
                                                                <span class="date">{{problem.createTime}}</span>
                                                                <span class="category"><a href="#" title="View all posts in Server &amp; Database">Server &amp; Database</a></span>
                                                                <span class="comments"><a href="#" title="Comment on Integrating WordPress with Your Website">{{problem.answerNumber}}</a></span>
                                                                <span class="like-count">66</span>
                                                        </div><!-- end of post meta -->
                                                        <p>Many of us work in an endless stream of tasks, browser tasks, social media, emails, meetings, rushing from one thing to another, never pausing and never ending.&nbsp;Then the day is over, and we are exhausted, and we often have very little to show for it. And we start the next day, ready for a mindless stream of tasks and distractions.</p>
                                                </article>

                                                <div class="like-btn">

                                                        <form id="like-it-form" action="#" method="post">
                                                                <span class="like-it ">66</span>
                                                                <input type="hidden" name="post_id" value="99">
                                                                <input type="hidden" name="action" value="like_it">
                                                        </form>

                                                        <span class="tags">
                                                                <strong>Tags:&nbsp;&nbsp;</strong><a href="#" rel="tag">basic</a>, <a href="#" rel="tag">setting</a>, <a href="http://knowledgebase.inspirythemes.com/tag/website/" rel="tag">website</a>
                                                        </span>

                                                </div>

                                                <section id="comments">

                                                        <h3 id="comments-title">(3) 回答</h3>

                                                        <ol class="commentlist">

                                                                <li class="comment even thread-even depth-1" id="li-comment-2" v-for="(answer,index) in answers" :key="answer.id">
                                                                        <article id="comment-2">

                                                                                <a href="#">
                                                                                        <img alt="" src="http://1.gravatar.com/avatar/50a7625001317a58444a20ece817aeca?s=60&amp;d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D60&amp;r=G" class="avatar avatar-60 photo" height="60" width="60">
                                                                                </a>

                                                                                <div class="comment-meta">

                                                                                        <h5 class="author">
                                                                                                <cite class="fn">
                                                                                                        <a href="#" rel="external nofollow" class="url">{{answer.answerUserName}}</a>
                                                                                                </cite>
                                                                                                -- <span class="like-count">666</span><!--<a class="comment-reply-link" href="#"> </a>-->
                                                                                        </h5>

                                                                                        <p class="date">
                                                                                                <a href="#">
                                                                                                        <time datetime="2013-02-26T13:18:47+00:00">{{answer.createTime}}</time>
                                                                                                </a>
                                                                                        </p>

                                                                                </div><!-- end .comment-meta -->

                                                                                <div class="comment-body" v-html="answer.content">

                                                                                </div><!-- end of comment-body -->

                                                                        </article><!-- end of comment -->
                                                                        <!--先不要子回复
<!--                                                                        <ul class="children">-->

<!--                                                                                <li class="comment byuser comment-author-saqib-sarwar bypostauthor odd alt depth-2" id="li-comment-3">-->
<!--                                                                                        <article id="comment-3">-->

<!--                                                                                                <a href="#">-->
<!--                                                                                                        <img alt="" src="http://0.gravatar.com/avatar/2df5eab0988aa5ff219476b1d27df755?s=60&amp;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D60&amp;r=G" class="avatar avatar-60 photo" height="60" width="60">-->
<!--                                                                                                </a>-->

<!--                                                                                                <div class="comment-meta">-->

<!--                                                                                                        <h5 class="author">-->
<!--                                                                                                                <cite class="fn">saqib sarwar</cite>-->
<!--                                                                                                                - <a class="comment-reply-link" href="#">Reply</a>-->
<!--                                                                                                        </h5>-->

<!--                                                                                                        <p class="date">-->
<!--                                                                                                                <a href="#">-->
<!--                                                                                                                        <time datetime="2013-02-26T13:20:14+00:00">February 26, 2013 at 1:20 pm</time>-->
<!--                                                                                                                </a>-->
<!--                                                                                                        </p>-->

<!--                                                                                                </div>&lt;!&ndash; end .comment-meta &ndash;&gt;-->

<!--                                                                                                <div class="comment-body">-->
<!--                                                                                                        <p>Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.</p>-->
<!--                                                                                                </div>&lt;!&ndash; end of comment-body &ndash;&gt;-->

<!--                                                                                        </article>&lt;!&ndash; end of comment &ndash;&gt;-->

<!--                                                                                </li>-->
<!--                                                                        </ul>&ndash;&gt;-->
                                                                </li>
                                                        <div id="respond">

                                                                <h3>你的回答</h3>

                                                                <div class="cancel-comment-reply">
                                                                        <a rel="nofollow" id="cancel-comment-reply-link" href="#" style="display:none;">Click here to cancel reply.</a>
                                                                </div>


                                                                <form action="#" method="post" id="commentform">


                                                                        <p class="comment-notes">邮箱必填，审核后我们会通知您！<span class="required">*</span></p>

                                                                        <div>
                                                                                <label for="author">Name *</label>
                                                                                <input class="span4" type="text" name="author" id="author" value="" size="22">
                                                                        </div>

                                                                        <div>
                                                                                <label for="email">Email *</label>
                                                                                <input class="span4" type="text" name="email" id="email" value="" size="22" >
                                                                        </div>

                                                                        <div>
                                                                                <label for="comment">Comment</label>
                                                                                <textarea class="span8" name="comment" id="comment" cols="58" rows="10"></textarea>
                                                                        </div>

                                                                        <p class="allowed-tags">支持代码，欢迎使用图片做进一步解释说明</p>

                                                                        <div>
                                                                                <input class="btn" name="submit" type="submit" id="submit"  value="提交">
                                                                        </div>

                                                                </form>

                                                        </div>

                                                </section><!-- end of comments -->

                                        </div>
                                        <!-- end of page content -->


                                        <!-- start of sidebar -->
                                        <aside class="span4 page-sidebar">

                                                <section class="widget">
                                                        <div class="support-widget">
                                                                <h3 class="title">联系</h3>
                                                                <p class="intro">justdoitliang@foxmail.com.</p>
                                                        </div>
                                                </section>


                                                <section class="widget">
                                                        <h3 class="title">相关问题</h3>
                                                        <ul class="articles">
                                                                <li class="article-entry standard" v-for="(relatedProblem,index) in relatedProblems" :key="relatedProblem.id">
                                                                        <h4><a :href="relatedProblem.id">{{relatedProblem.title}}</a></h4>
                                                                        <span class="article-meta">25 Feb, 2013 in <a href="#" title="View all posts in Server &amp; Database">Server &amp; Database</a></span>
                                                                        <span class="like-count">{{relatedProblem.likeNumber}}</span>
                                                                </li>
                                                        </ul>
                                                </section>
                                        </aside>
                                        <!-- end of sidebar -->
                                </div>
                        </div>
                </div>
                <!-- End of Page Container -->
           </div>
            <!--vue 作用范围结束-->
                <!-- Start of Footer -->
                        <!-- end of #footer -->

                        <!-- Footer Bottom -->
                        <div id="footer-bottom-wrapper">
                                <div id="footer-bottom" class="container">
                                        <div class="row">
                                                <div class="span6">
                                                        <p class="copyright">
                                                                Copyright &copy; 2014.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a>
                                                        </p>
                                                </div>
                                                <div class="span6">
                                                        <!-- Social Navigation -->
                                                        <ul class="social-nav clearfix">
                                                                <li class="linkedin"><a target="_blank" href="#"></a></li>
                                                                <li class="stumble"><a target="_blank" href="#"></a></li>
                                                                <li class="google"><a target="_blank" href="#"></a></li>
                                                                <li class="deviantart"><a target="_blank" href="#"></a></li>
                                                                <li class="flickr"><a target="_blank" href="#"></a></li>
                                                                <li class="skype"><a target="_blank" href="skype:#?call"></a></li>
                                                                <li class="rss"><a target="_blank" href="#"></a></li>
                                                                <li class="twitter"><a target="_blank" href="#"></a></li>
                                                                <li class="facebook"><a target="_blank" href="#"></a></li>
                                                        </ul>
                                                </div>
                                        </div>
                                </div>
                        </div>
                        <!-- End of Footer Bottom -->

                </footer>
                <!-- End of Footer -->

                <a href="#top" id="scroll-top"></a>


                <script type='text/javascript' src='../../js/jquery-1.8.3.min.js'></script>
                <script type='text/javascript' src='../../js/jquery.easing.1.3.js'></script>
                <script type='text/javascript' src='../../js/prettyphoto/jquery.prettyPhoto.js'></script>
                <script type='text/javascript' src='../../js/jflickrfeed.js'></script>
                <script type='text/javascript' src='../../js/jquery.liveSearch.js'></script>
                <script type='text/javascript' src='../../js/jquery.form.js'></script>
                <script type='text/javascript' src='../../js/jquery.validate.min.js'></script>
                <script type='text/javascript' src='../../js/custom.js'></script>
</body>
<!-- script -->

<script type="text/javascript">
        var problemAnswerPageVue=new Vue({
                el:"#problemAnswerPage",
                data() {
                        return {
                                problem: {},
                                relatedProblems:[],
                                answers:[],
                                currentProblemId:0,
                                lastProblemId:0,
                                rootURL:''
                        }
                },
                methods:{
                },
                created(){
                        var  baseURL=window.location.host;
                        var url=window.location.href;
                        var wholeURL=window.location.href;
                        var problemId=wholeURL.substr(wholeURL.indexOf("problem/")+8,wholeURL.length);
                        baseURL="http://"+baseURL;
                        this.rootURL=baseURL;
                        axios.get(baseURL+'/api/problem/'+problemId).then(response => {
                                this.problem=response.data.data;
                         }).catch(error=>{
                                this.tags=[{'id':1,'name':'abcd'}]
                        })
                        axios.get(baseURL+'/api/answer/problem/'+problemId).then(resp=>{
                                this.answers=resp.data.data;
                        }).catch(error=>{

                        })

                        axios.get(baseURL+'/api/problem/'+problemId+'/relate').then(resp=>{
                            this.relatedProblems=resp.data.data;
                        }).catch(error=>{
                        })
                }
        });
</script>
</html>
